<template>
    <div class="app-container">
        <el-tabs v-model="activeNames">
            <el-tab-pane label="设备产能" name="first">
                <el-form ref="equipmentForm" :model="equipmentForm" :inline="true">
                    <el-form-item label="设备编号" prop="SBBH">
                        <el-input v-model="equipmentForm.SBBH" placeholder="请输入设备编号" clearable @keyup.enter.native="handleQuerySB"></el-input>
                    </el-form-item>
                    <el-form-item label="机台号" prop="JTH">
                        <el-input v-model="equipmentForm.JTH" placeholder="请输入机台号" clearable @keyup.enter.native="handleQuerySB"/>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuerySB">搜索</el-button>
                        <el-button  icon="el-icon-refresh" size="mini" @click="resetQuerySB">重置</el-button>
                    </el-form-item>
                </el-form>
                
                <h2 align="center">生产设备清单</h2>
                <el-table :data="equipmentDataTable" @row-click="showTap"  :row-class-name="rowClassName">
                    <el-table-column label="设备编号" prop="SBBH" align="center"/>
                    <el-table-column label="设备名称" prop="SBMC" align="center"/>
                    <el-table-column label="机台号" prop="JTH" align="center"/>
                    <el-table-column label="任务生产数量" prop="RWSCSL" align="center"/>
                    <el-table-column label="已完成数量" prop="YWCSL" align="center"/>
                </el-table>

                <pagination  :total="totalSB" :page.sync="queryParamsSB.pageNum"
          :limit.sync="queryParamsSB.pageSize" @pagination="getListSB" />

                <h2 align="center">设备任务清单</h2>
                <el-table :data="equipmentWorkDataTable">
                    <el-table-column label="销售订单号" prop="XSDDH" align="center"/>
                    <el-table-column label="生产任务单号" prop="SCRWDH" align="center"/>
                    <el-table-column label="产品代号" prop="CPDH" align="center"/>
                    <el-table-column label="产品名称" prop="CPMC" align="center"/>
                    <el-table-column label="花色" prop="HS" align="center"/>
                    <el-table-column label="单位" prop="DW" align="center"/>
                    <el-table-column label="模具编号" prop="MJBH" align="center"/>
                    <el-table-column label="克重" prop="KZ" align="center"/>
                    <el-table-column label="订单数量" prop="DDSL" align="center"/>
                    <el-table-column label="审核交期" prop="SHJQ" align="center"/>
                    <el-table-column label="需生产数量" prop="XSCSL" align="center"/>
                    <el-table-column label="产品数量差值" prop="CPSLCZ" align="center"/>
                </el-table>
            </el-tab-pane>
            <el-tab-pane label="人员产能" name="second">
                <el-form :model="staffDataForm" ref="staffDataForm" size="small" :inline="true">
                    <el-form-item label="员工姓名" prop="YGXM">
                        <el-input v-model="staffDataForm.YGXM" placeholder="请输入员工姓名" clearable @keyup.enter.native="handleQueryRY"/>
                    </el-form-item>
                    <el-form-item label="部门" prop="BM">
                        <el-input v-model="staffDataForm.BM" placeholder="请输入部门" clearable @keyup.enter.native="handleQueryRY"/>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQueryRY">搜索</el-button>
                        <el-button  icon="el-icon-refresh" size="mini" @click="resetQueryRY">重置</el-button>
                    </el-form-item>
                </el-form>
                
                <h2 align="center">生产员工清单</h2>
                <el-table :data="staffDataTable">
                    <el-table-column label="工号" prop="GH" align="center"/>
                    <el-table-column label="姓名" prop="XM" align="center"/>
                    <el-table-column label="所在部门" prop="SZBM" align="center"/>
                    <el-table-column label="任务生产数量" prop="RWSCSL" align="center"/>
                    <el-table-column label="已完成数量" prop="YWCSL" align="center"/>
                </el-table>

                <pagination  :total="totalRY" :page.sync="queryParamsRY.pageNum"
          :limit.sync="queryParamsRY.pageSize" @pagination="getListRY" />

          <h2 align="center">员工任务清单</h2>
          <el-table :data="staffWorkDataTable">
            <el-table-column label="销售订单号" prop="XSDDH" align="center"/>
                    <el-table-column label="生产任务单号" prop="SCRWDH" align="center"/>
                    <el-table-column label="产品代号" prop="CPDH" align="center"/>
                    <el-table-column label="产品名称" prop="CPMC" align="center"/>
                    <el-table-column label="花色" prop="HS" align="center"/>
                    <el-table-column label="单位" prop="DW" align="center"/>
                    <el-table-column label="模具编号" prop="MJBH" align="center"/>
                    <el-table-column label="克重" prop="KZ" align="center"/>
                    <el-table-column label="订单数量" prop="DDSL" align="center"/>
                    <el-table-column label="审核交期" prop="SHJQ" align="center"/>
                    <el-table-column label="需生产数量" prop="XSCSL" align="center"/>
                    <el-table-column label="产品数量差值" prop="CPSLCZ" align="center"/>
          </el-table>

            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>

    export default {
        data () {
            return {
                activeNames: 'first',
                //表单参数
                equipmentForm: {},
                staffDataForm: {},

                equipmentDataTable: [{
                    SBBH:'1001',
                    SBMC:'设备1',
                    JTH:'10001',
                    RWSCSL:'10',
                    YWCSL:'3',
                },{
                    SBBH:'1002',
                    SBMC:'设备2',
                    JTH:'10002',
                    RWSCSL:'10',
                    YWCSL:'3',
                },{
                    SBBH:'1003',
                    SBMC:'设备2',
                    JTH:'10003',
                    RWSCSL:'10',
                    YWCSL:'3',
                },{
                    SBBH:'1004',
                    SBMC:'设备4',
                    JTH:'10004',
                    RWSCSL:'10',
                    YWCSL:'3',
                }],
                equipmentWorkDataTable: [{
                    XSDDH:'111',
                    SCRWDH:'GB_111',
                    CPDH:'101',
                    CPMC:'产品1',
                    HS:'RGB',
                    DW:'kg',
                    MJBH:'111',
                    KZ:'1kg',
                    DDSL:'11',
                    SHJQ:'2024-1-5',
                    XSCSL:'100',
                    CPSLCZ:'12',
                },{
                    XSDDH:'111',
                    SCRWDH:'GB_111',
                    CPDH:'101',
                    CPMC:'产品1',
                    HS:'RGB',
                    DW:'kg',
                    MJBH:'111',
                    KZ:'1kg',
                    DDSL:'11',
                    SHJQ:'2024-1-5',
                    XSCSL:'100',
                    CPSLCZ:'12',
                },{
                    XSDDH:'111',
                    SCRWDH:'GB_111',
                    CPDH:'101',
                    CPMC:'产品1',
                    HS:'RGB',
                    DW:'kg',
                    MJBH:'111',
                    KZ:'1kg',
                    DDSL:'11',
                    SHJQ:'2024-1-5',
                    XSCSL:'100',
                    CPSLCZ:'12',
                },{
                    XSDDH:'111',
                    SCRWDH:'GB_111',
                    CPDH:'101',
                    CPMC:'产品1',
                    HS:'RGB',
                    DW:'kg',
                    MJBH:'111',
                    KZ:'1kg',
                    DDSL:'11',
                    SHJQ:'2024-1-5',
                    XSCSL:'100',
                    CPSLCZ:'12',
                }],
                staffDataTable: [{
                    GH:'10001',
                    XM:'员工1',
                    SZBM:'部门1',
                    RWSCSL:'10',
                    YWCSL:'5',
                },{
                    GH:'10001',
                    XM:'员工1',
                    SZBM:'部门1',
                    RWSCSL:'10',
                    YWCSL:'5',
                },{
                    GH:'10001',
                    XM:'员工1',
                    SZBM:'部门1',
                    RWSCSL:'10',
                    YWCSL:'5',
                },{
                    GH:'10001',
                    XM:'员工1',
                    SZBM:'部门1',
                    RWSCSL:'10',
                    YWCSL:'5',
                }],
                staffWorkDataTable: [{
                    XSDDH:'111',
                    SCRWDH:'GB_111',
                    CPDH:'101',
                    CPMC:'产品1',
                    HS:'RGB',
                    DW:'kg',
                    MJBH:'111',
                    KZ:'1kg',
                    DDSL:'11',
                    SHJQ:'2024-1-5',
                    XSCSL:'100',
                    CPSLCZ:'12',
                },{
                    XSDDH:'111',
                    SCRWDH:'GB_111',
                    CPDH:'101',
                    CPMC:'产品1',
                    HS:'RGB',
                    DW:'kg',
                    MJBH:'111',
                    KZ:'1kg',
                    DDSL:'11',
                    SHJQ:'2024-1-5',
                    XSCSL:'100',
                    CPSLCZ:'12',
                },{
                    XSDDH:'111',
                    SCRWDH:'GB_111',
                    CPDH:'101',
                    CPMC:'产品1',
                    HS:'RGB',
                    DW:'kg',
                    MJBH:'111',
                    KZ:'1kg',
                    DDSL:'11',
                    SHJQ:'2024-1-5',
                    XSCSL:'100',
                    CPSLCZ:'12',
                },{
                    XSDDH:'111',
                    SCRWDH:'GB_111',
                    CPDH:'101',
                    CPMC:'产品1',
                    HS:'RGB',
                    DW:'kg',
                    MJBH:'111',
                    KZ:'1kg',
                    DDSL:'11',
                    SHJQ:'2024-1-5',
                    XSCSL:'100',
                    CPSLCZ:'12',
                }],
                totalRY:'4',
                totalSB:'4',
                queryParamsSB: {
                    pageNum:1,
                    pageSize:10,
                },queryParamsRY: {
                    pageNum:1,
                    pageSize:10,
                },
                SBBH:'',
        }
        },
        methods: {
            // 显示高亮
            rowClassName({ row }) {
              return row.SBBH == this.SBBH ? 'selected-row' : ''; // 判断是否选中
            },
            showTap(row) {
              this.SBBH = row.SBBH;
            },
        },
    }
</script>
<style>
.selected-row {
  background-color: yellow !important;
  /* 选中行的背景颜色 */
}
</style>
